<template>
  <el-card>
    <el-row :gutter="8">
      <el-col
        v-for="item of svgIcons"
        :key="item"
        :span="1"
        @click="handleSelectIcon(item)"
      >
        <svg-icon :icon-class="item" :class-name="className" />
      </el-col>
    </el-row>
  </el-card>
</template>

<script>
import svgIcons from './svg-icons'

export default {
  name: 'SvgCard',
  props: {
    className: {
      default: '',
      type: String
    }
  },
  data() {
    return {
      svgIcons
    }
  },
  methods: {
    handleSelectIcon(symbol) {
      this.$emit('handleSelectIcon', symbol)
    }
  }
}
</script>

<style lang="scss" scoped>

</style>
